<!-- 空列表提示 -->
<template>
  <div :class="{ 'page': fullScreen }" class="empty-tip">
    <div class="container">
      <i :style="background"></i>
      <p>{{title}}</p>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: 'String',
      default: '暂无记录'
    },
    fullScreen: {
      type: 'Boolean',
      default: true
    }
  },
  data () {
    return {
      icons: [
        `${require('static/images/empty.png')}`
      ]
    }
  },
  computed: {
    background () {
      return `background-image: url(${this.icons[0]});`
    }
  }
}
</script>

<style lang="less" scoped>
.empty-tip {
  display: flex;
  align-items: center;
  justify-content: center;
  .container {
    padding: 50rpx 0;
    i {
      width: 174rpx;
      height: 104rpx;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center center;
    }
    p {
      color: #bfbfbf;
      text-align: center;
      font-size: 30rpx;
      padding-top: 30rpx;
    }
  }
}
</style>
